<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:pe="http://primefaces.org/ui/extensions">

    <h:body>

        <ui:composition template="/resources/template/template.xhtml">

            <ui:define name="content">
                <h:form>
                    <p:panelGrid columns="1" >
                        <p:panel header="Select Investigation and Field" >
                            <p:panelGrid columns="2" >


                                <p:selectBooleanCheckbox itemLabel="Master Items Only" value="#{investigationController.listMasterItemsOnly}">
                                    <p:ajax event="change" process="@this" update="acPt" />
                                </p:selectBooleanCheckbox>
                                <p:autoComplete widgetVar="aPt" id="acPt" forceSelection="true"
                                                value="#{investigationItemDynamicLabelController.investigation}" 
                                                completeMethod="#{investigationController.completeInvest}" 
                                                var="apt" itemLabel="#{apt.name}" 
                                                itemValue="#{apt}" size="30"  style="width: 400px;">
                                    <p:column>
                                        #{apt.name}
                                    </p:column>
                                    <p:column>
                                        #{apt.id}
                                    </p:column>
                                    <p:column>
                                        #{apt.fullName}
                                    </p:column>
                                    <p:column>
                                        #{apt.department.name}
                                    </p:column>
                                    <p:column>
                                        #{apt.institution.name}
                                    </p:column>
                                    <p:ajax process="acPt iif" update="iif tbl" event="itemSelect"/>
                                </p:autoComplete> 

                                <h:outputLabel value="Select Dynamic Label" ></h:outputLabel>
                                <p:selectOneMenu style="min-width: 230px;" id="iif" value="#{investigationItemDynamicLabelController.investigationItemofDynamicLabelType}" >
                                    <f:selectItem itemLabel="Select Item" />
                                    <f:selectItems value="#{investigationItemDynamicLabelController.investigationItemsOfDynamicLabelType}" var="iifs" itemLabel="#{iifs.name}" itemValue="#{iifs}" />
                                    <p:ajax event="change" process="iif" update="tbl" />
                                </p:selectOneMenu>

                            </p:panelGrid>
                        </p:panel>
                        <p:panel header="Adding new dynamic label" >
                            <p:panelGrid columns="2" >
                                <h:outputLabel value="Sex" ></h:outputLabel>
                                <p:selectOneMenu id="txtNewSex"  value="#{investigationItemDynamicLabelController.sex}" style="width: 200px;">
                                    <f:selectItem itemLabel="Select Sex"/>
                                    <f:selectItem itemLabel="Male" itemValue="Male"/>
                                    <f:selectItem itemLabel="Female" itemValue="Female"/>
                                </p:selectOneMenu>

                                <h:outputLabel value="From Age" ></h:outputLabel>
                                <h:panelGrid columns="2">
                                    <p:inputText autocomplete="off" value="#{investigationItemDynamicLabelController.fromAge}"></p:inputText>
                                    <h:selectOneMenu value="#{investigationItemDynamicLabelController.fromAgeUnit}" >
                                        <f:selectItem itemValue="Days" />
                                        <f:selectItem itemValue="Months" />
                                        <f:selectItem itemValue="Years" />
                                    </h:selectOneMenu>
                                </h:panelGrid>
                                <h:outputLabel value="To Age" ></h:outputLabel>
                                <h:panelGrid columns="2">
                                    <p:inputText autocomplete="off" value="#{investigationItemDynamicLabelController.toAge}"></p:inputText>
                                    <h:selectOneMenu value="#{investigationItemDynamicLabelController.toAgeUnit}" >
                                        <f:selectItem itemValue="Days" />
                                        <f:selectItem itemValue="Months" />
                                        <f:selectItem itemValue="Years" />
                                    </h:selectOneMenu>
                                </h:panelGrid>
                                <h:outputLabel value="Label" ></h:outputLabel>
                                <p:inputTextarea value="#{investigationItemDynamicLabelController.flagMessage}" ></p:inputTextarea>
                                <h:outputLabel value="Label" ></h:outputLabel>
                                <p:commandButton value="Save" ajax="false" action="#{investigationItemDynamicLabelController.saveForDynamicLabel()}" onclick="onSubmitButton();"  >
                                </p:commandButton>


                            </p:panelGrid>
                        </p:panel>
                        <p:panel header="Already added Labels" >
                            <p:panelGrid columns="1" >
                                <f:facet name="header" >
                                    <p:commandButton value="Excel" ajax="false">
                                        <pe:exporter type="xlsx" target="tbl" fileName="/lab/dianamic_lables"  />
                                    </p:commandButton>
                                </f:facet>
                                <p:dataTable id="tbl" value="#{investigationItemDynamicLabelController.dynamicLabels}" var="f" >
                                    <f:facet name="header" >
                                        <p:outputLabel value="#{investigationItemDynamicLabelController.investigation.name} - " />
                                        
                                        <p:outputLabel value="#{investigationItemDynamicLabelController.investigationItemofDynamicLabelType.name}" />
                                    </f:facet>
                                    <p:column headerText="Sex">
                                        <f:facet name="header" >
                                            <p:outputLabel value="Sex" />
                                        </f:facet>
                                        <p:outputLabel value="#{f.sex}" />
                                    </p:column>
                                    <p:column headerText="From Age">
                                        <f:facet name="header" >
                                            <p:outputLabel value="From Age" />
                                        </f:facet>
                                        <p:inputText autocomplete="off" value="#{f.fromAge}" >
                                            <p:ajax event="blur" listener="#{investigationItemDynamicLabelController.saveFlags()}" process="tbl"/>
                                        </p:inputText>
                                    </p:column>
                                    <p:column headerText="To Age">
                                        <f:facet name="header" >
                                            <p:outputLabel value="To Age" />
                                        </f:facet>
                                        <p:inputText autocomplete="off" value="#{f.toAge}" >
                                            <p:ajax event="blur" listener="#{investigationItemDynamicLabelController.saveFlags()}" process="tbl"/>
                                        </p:inputText>
                                    </p:column>

                                    <p:column headerText="Message">
                                        <f:facet name="header" >
                                            <p:outputLabel value="Message" />
                                        </f:facet>
                                        <p:inputText autocomplete="off" value="#{f.flagMessage}" >
                                            <p:ajax event="blur" listener="#{investigationItemDynamicLabelController.saveFlags()}" process="tbl"/>
                                        </p:inputText>
                                    </p:column>

                                    <p:column headerText="Remove" exportable="false">
                                        <p:commandButton ajax="false" value="Remove" action="#{investigationItemDynamicLabelController.removeDynamicLabelValue()}" onclick="onSubmitButton();"  >
                                            <f:setPropertyActionListener value="#{f}" target="#{investigationItemDynamicLabelController.removingInvestigationItemofDynamicLabelType}" />
                                        </p:commandButton>
                                    </p:column>

                                </p:dataTable>

                            </p:panelGrid>

                        </p:panel>
                    </p:panelGrid>




                </h:form>
            </ui:define>


        </ui:composition>

    </h:body>
</html>
